<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
●rotate()旋转
rotate()方法用于将画布的x轴顺时针转动到与原x轴方向成angle角的位置，转动后x轴方向同时发生变化。
<canvas id="canvas"></canvas>
<script>
  var ctx = document.getElementById('canvas1').getContext('2d');
  ctx.translate(160,160);// 平移
  ctx.fillStyle = 'rgba(200,54,54,0.5)';
  for(var i = 0;i < 15; i++)
  {
    ctx.scale(0.98,0.98);
    ctx.moveTo(0,0);// 移到原点
    ctx.lineTo(30,30);
    ctx.stroke();
    ctx.rotate(Math.PI/10);// 将画布的x轴旋转到与原X轴成18度，每循环一次旋转18度
    ctx.fillRect(0,0,100,50);
  }
</script>
</body>
</html>
